<template>
  <div>
    <div style="padding:15px 30px">
      <div class="flex align-center table-top-btns">
        <h5 class="flex align-center">
          <svg-icon style="margin-right:15px" icon-class="list" :size="15" />数据列表
        </h5>
      </div>
      <el-table v-show="tableData.length > -1" :data="tableData" border>
        <el-table-column align="center" prop="title" label="套餐名称" width="300" />
        <el-table-column align="center" prop="lease_set" label="租期设置" />
        <el-table-column align="center" prop="is_huabei" label="花呗分期" />
        <el-table-column align="center" prop="quantity" label="数量" />
        <el-table-column align="center" prop="foregift" label="押金" />
        <el-table-column align="center" prop="is_buy_out" label="是否买断" />
        <el-table-column align="center" prop="price" label="官网价格" />
        <el-table-column align="center" prop="buyout_amount" label="买断价" />
        <el-table-column fixed="right" align="center" label="操作" width="200">
          <template slot-scope="scope">
            <el-button v-if="$hasMethod('#edit')" type="primary" size="mini" @click="$router.push({ name: 'goodsMealEdit', params: { goodsId, editId: scope.row.id } })">编辑</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div class="fix-footer-btns">
      <el-button size="small" class="blue_border" @click="$router.go(-1)">返回</el-button>
    </div>
  </div>
</template>

<script>
// import customPage from '@/components/customPage'
import { getGoodsSetmealList } from '@/api/audit'
export default {
  // components: { customPage },
  // props: ['goodsId'],
  props: {
    goodsId: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      tableData: [],
      goodsName: ''
    }
  },
  mounted() {
    this.getList()
  },
  methods: {
    getList() {
      getGoodsSetmealList(this.goodsId).then(res => {
        this.goodsName = res.goods_name
        this.tableData = res.setmeal || []
        this.$route.meta.title = this.goodsName + '的套餐列表'
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.goods_info {
  .info {
    margin-left: 10px;

    p {
      color: #666666;
    }

    p:first-child {
      color: #999999;
    }
  }
}

.bottomBtn {
  height: 60px;
  line-height: 70px;
  background: #ffffff;
  box-shadow: 0px -1px 0px 0px #eeeeee;
  text-align: center;
  margin-top: 50px;
}
</style>
